const y_tools = (parent) => {

	//创建画布
	const fnCrateCanv = (w, h) => {
		var cav = document.createElement('canvas');
		cav.width = w;
		cav.height = h;
		return cav;
	}

	//创建画笔
	const fnCreatePattern = (img, w, h) => {
		img.width = h;
		img.height = h;
		var patternCanvas = document.createElement('canvas');
		var patternCtx = patternCanvas.getContext('2d');
		patternCanvas.width = h;
		patternCanvas.height = h;
		//console.log("wh:" + w + "." + h + "img:" + img);
		patternCtx.drawImage(img, 0, 0, h, h);
		var pattern = patternCtx.createPattern(patternCanvas, 'no-repeat');

		return pattern;
	}
	//绘制 xtc, 中间文字，画笔宽度，画笔
	const fnDrawNew = (ctx, value, bold, pattern) => {

		var bhalf = bold / 2;
		var h = ctx.canvas.height;

		//半径
		var r = h / 2 - bhalf;
		var p = {
			x: r + bhalf,
			y: r + bhalf
		};
		ctx.lineWidth = bold;
		ctx.lineCap = "round";
		ctx.clearRect(0, 0, h, h);

		ctx.shadowBlur = 3;
		ctx.shadowColor = "#ebebeb66";

		//console.log("p", p);


		var max = 2.5;
		var start = 0.5 * Math.PI;
		var v = start + ((value - 3) / 100) * 2 * Math.PI;

		function draw() {
			ctx.beginPath();
			ctx.strokeStyle = pattern;


			/*
			------1.5PI------
			--------|--------
			1PI-----|-----0PI
			--------|--------
			------0.5PI------
			*/
			//1。画笔
			ctx.arc(p.x, p.y, r, start, v, false);
			ctx.stroke();

			//2。结束圆
			ctx.lineWidth = bold * 1.8;
			ctx.lineCap = "round";
			ctx.beginPath();
			ctx.strokeStyle = '#fff';
			ctx.arc(p.x - bhalf * 0.8, p.y, r, v, v, false);
			ctx.stroke();

			//3。文字
			ctx.beginPath();
			ctx.lineWidth = 1;
			var fontsize = 16;
			ctx.font = "bold " + fontsize + "px 'Agency FB'";
			var txt = value;
			var twh = ctx.measureText(txt);
			var twhh = {
				h: fontsize / 2,
				w: twh.width / 2
			};
			var tsp = {
				x: (p.x - twhh.w).toFixed(0),
				y: (p.y - twhh.h).toFixed(0)
			};
			var tep = {
				x: (p.x + twhh.w).toFixed(0),
				y: (p.y + twhh.h).toFixed(0)
			};

			//渐变起始
			var gradient = ctx.createLinearGradient(tsp.x, tsp.y, tep.x, tep.y);
			gradient.addColorStop("0", "#4DF5B0");
			gradient.addColorStop("1", '#03BBFF');
			ctx.strokeStyle = gradient;

			ctx.textAlign = "center";
			//文字  位置
			ctx.strokeText(txt, p.x, p.y + twhh.h / 2);
		}
		draw();

	}



	//主页  事物处理情况 图表 
	const fnChart1 = (dats, months) => {
		var leg = [];
		var xax = months;
		var series = [];
		var lcolor = new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
				offset: 0,
				color: '#32BBC0'
			},
			{
				offset: 1,
				color: 'rgba(50,187,192,0.3)'
			}
		]);
		for (var i = 0; i < dats.length; i++) {
			var dat = dats[i];
			leg.push(dat.name);
			var seri = {
				type: 'line',
				name: dat.name,
				smooth: true,
				symbol: 'none',
				//stack: '总量', //此设置数据相加
				areaStyle: {
					color: lcolor
				},
				emphasis: {
					focus: 'series'
				},
				tooltip: {
					show: true,
					trigger: 'axis'
				},
				data: [...dat.values]
			};
			//
			if (i > 0) {
				seri['areaStyle'] = {
					color: 'transparent'
				};
			}
			// if (i + 1 == dats.length) {
			// 	seri['label'] = {
			// 		normal: {
			// 			show: true,
			// 			position: 'top'
			// 		}
			// 	};
			// }
			series.push(seri);
		}
		var opts = {
			title: {
				text: ''
			},
			tooltip: {
				show: true,
				triggerOn: 'mousemove'
			},
			legend: {
				// data: [...leg],
				// textStyle: {
				// 	color: '#fff'
				// },
				show: false,
			},
			grid: {
				left: '0',
				right: '16px',
				bottom: '20px',
				containLabel: true,
				tooltip: {
					show: true,
					trigger: 'axis', //axis
					axisPointer: {
						axis: 'x',
						type: 'cross'
					}
				},
				formatter: '{b0}: {c0}<br />{b1}: {c1}'
			},
			xAxis: {
				type: 'category',
				boundaryGap: false,
				data: [...xax],
			},
			yAxis: {
				type: 'value',
				show: false,
			},
			series: series
		};
		opts = JSON.parse(JSON.stringify(opts));
		//console.log(JSON.stringify(opts));
		return opts;

	}



	const hBindCamEditMenu = (g, b) => {
		console.log("绑定cam菜单");
		g.bindContextMenu([{
			text: "设置属性",
			iconCls: "fa fa-edit",
			show: function(e) {
				let graphic = e.graphic;
				if (!graphic || !graphic.startEditing) {
					return false;
				}
				return !graphic.isEditing;
			},
			callback: function(e) {
				let graphic = e.graphic;
				if (!graphic) {
					return false;
				}
				if (graphic) {
					//g.startEditing(graphic);
					b();
				}
			},
		}]);
		return;
		g.bindContextMenu([{
				text: "开始编辑对象",
				iconCls: "fa fa-edit",
				show: function(e) {
					let graphic = e.graphic;
					if (!graphic || !graphic.startEditing) {
						return false;
					}
					return !graphic.isEditing;
				},
				callback: function(e) {
					let graphic = e.graphic;
					if (!graphic) {
						return false;
					}
					if (graphic) {
						g.startEditing(graphic);
						b();
					}
				},
			},
			{
				text: "停止编辑对象",
				iconCls: "fa fa-edit",
				show: function(e) {
					let graphic = e.graphic;
					if (!graphic) {
						return false;
					}
					return graphic.isEditing;
				},
				callback: function(e) {
					let graphic = e.graphic;
					if (!graphic) {
						return false;
					}
					if (graphic) {
						g.stopEditing(graphic);
						b();
					}
				},
			},
			{
				text: "删除对象",
				iconCls: "fa fa-trash-o",
				show: (event) => {
					let graphic = event.graphic;
					if (!graphic || graphic.isDestroy) {
						return false;
					} else {
						return true;
					}
				},
				callback: function(e) {
					let graphic = e.graphic;
					if (!graphic) {
						return;
					}
					g.removeGraphic(graphic);
				},
			}
		])
	};


	const hChart_proj_gk = (dom, ld, zs) => {
		//console.log("proj chart:",ld,zs);
		var ldname = [{
					text: '',
					max: 200
				},
				{
					text: '',
					max: 200
				},
				{
					text: '',
					max: 200
				},
				{
					text: '',
					max: 200
				},
				{
					text: '',
					max: 200
				},
				{
					text: '',
					max: 200
				}
			],
			ld_value = [120, 153, 80, 100, 30, 80];
		//color: ['#67F9D8', '#FFE434', '#56A3F1', '#FF917C'],

		if (ld?.names) {
			ldname = [];
			for (var i = 0; i < ld.names.length; i++) {
				ldname.push({
					text: ld.names[i], //'', //
					max: ld.max
				})
			}
			ld_value = ld.values;
		}
		var _zs = {
			names: ['1月', '2月', '3月', '4月', '5月'],
			value: [82, 73, 20, 93, 12],
		};
		if (zs) {
			_zs = zs;
		}
		//console.log(ldname);
		var option = {

			title: {
				text: '单位：（名称）',
				textAlign: 'middle',
				left: '50%',

				textStyle: {
					fontSize: 14
				}
			},
			xAxis: {
				type: 'category',
				boundaryGap: false,
				data: _zs.names,
			},

			yAxis: {
				type: 'value',
				show: false,
				splitLine: {
					show: false,
					lineStyle: {
						color: "#878787"
					},
				},
			},
			tooltip: {
				show: true,
			},
			grid: {
				top: '20%',
				right: '35%',
				bottom: '50',
				tooltip: {
					show: true,
					trigger: 'axis',
				},
				formatter: '{b0}: {c0}<br />{b1}: {c1}'
			},
			legend: {
				show: false,
			},
			radar: [{
				indicator: ldname,
				tooltip: {
					trigger: 'axis'
				},
				splitArea: {
					areaStyle: {
						color: new echarts.graphic.RadialGradient(0.5, 0.5, 0.5, [{
								color: 'rgb(86,83,102)',
								offset: 0
							},
							{
								color: 'rgba(86,83,102, 0.5)',
								offset: 1
							}
						]),
						shadowColor: 'rgba(0, 0, 0, 0.2)',
						shadowBlur: 10
					}
				},
				center: ['85%', '50%'],
				radius: '50%',
				axisName: {
					color: "rgba(0,0,0,0)",
				},
				splitLine: {
					lineStyle: {
						color: "#878787"
					},
				},
			}],
			series: [{
					type: 'radar',
					radarIndex: 0,
					tooltip: {
						trigger: 'item'
					},
					data: [{
						value: ld_value,
						name: '项目类型分布',
						symbol: 'none',
						areaStyle: {
							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
									color: 'rgba(84,172,255, 0.9)',
									offset: 0
								},
								{
									color: 'rgba(0,255,158, 0.9)',
									offset: 1
								}
							])
						}
					}]
				}, {
					name: '投资额',
					type: 'line',
					smooth: true,
					symbol: 'none',
					lineStyle: {
						color: "rgb(0,255,158)"
					},
					tooltip: {
						show: true,
						trigger: 'axis'
					},
					areaStyle: {
						color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
								offset: 0,
								color: 'rgb(0,255,158)'
							},
							{
								offset: 1,
								color: 'rgba(0,255,158,0.3)'
							}
						])
					},
					data: _zs.value,
				},
				// {
				// 	name: 'z2',
				// 	type: 'line',
				// 	smooth: true,
				// 	symbol: 'none',
				// 	lineStyle: {
				// 		color: "rgb(84,172,255)"
				// 	},
				// 	areaStyle: {
				// 		color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
				// 				offset: 0,
				// 				color: 'rgb(84,172,255)'
				// 			},
				// 			{
				// 				offset: 1,
				// 				color: 'rgba(84,172,255,0.3)'
				// 			}
				// 		])
				// 	},
				// 	data: [32, 53, 60, 73, 22]
				// },
			]
		};

		var myChart = echarts.init(dom);
		myChart.setOption(option);
	}

	const _fsize = 18;
	const hChart_proj_qx = (dom) => {
		var opt = {
			title: {
				text: "投资曲线",
				textStyle: {
					fontSize: _fsize,
					color: "#eee"
				},
				textAlign: 'middle',
				left: '50%',
			},
			tooltip: {
				show: true,
				trigger: 'item',
			},
			grid: {
				top: '30px',
				right: '20px',
				bottom: '50',
				tooltip: {
					show: true,
					trigger: 'axis',
				},
				formatter: '{b0}: {c0}<br />{b1}: {c1}'
			},
			xAxis: {
				type: 'category',
				boundaryGap: false,
				data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
			},
			yAxis: {
				type: 'value',
				show: false,
			},
			series: [{
					name: "计划",
					symbol: 'none',
					data: [820, 932, 901, 934, 1290, 1330, 1320],
					type: 'line',
					smooth: true
				},
				{
					name: "实际",
					symbol: 'none',
					data: [620, 832, 901],
					type: 'line',
					smooth: true
				},
			]
		};

		var myChart = echarts.init(dom);
		myChart.setOption(opt);
	}

	const hChart_proj_bar = (dom) => {
		var opt = {
			title: {
				text: "项目环节",
				textStyle: {
					fontSize: _fsize,
					color: "#eee"
				},
				textAlign: 'middle',
				left: '50%',
			},
			tooltip: {
				show: true,
				trigger: 'item',
			},
			xAxis: {
				type: 'category',
				data: [new Date().format("yyyy-MM")],

			},
			yAxis: {
				type: 'value',
				show: false,
			},
			grid: {
				top: '50px',
				right: '20px',
				bottom: '50',
				tooltip: {
					show: true,
					trigger: 'axis',
				},
				formatter: '{b0}: {c0}<br />{b1}: {c1}'
			},
			series: [{
					name: "前期谋划",
					data: [18],
					type: 'bar',
					label: {
						show: true,
						position: 'top',
					}
				}, {
					name: "设计方案",
					data: [9],
					type: 'bar',
					label: {
						show: true,
						position: 'top',
					}
				},
				{
					name: "备案立项",
					data: [13],
					type: 'bar',
					label: {
						show: true,
						position: 'top',
					}
				}, {
					name: "招投标",
					data: [1],
					type: 'bar',
					label: {
						show: true,
						position: 'top',
					}
				}, {
					name: "开工",
					data: [20],
					type: 'bar',
					label: {
						show: true,
						position: 'top',
					}
				}, {
					name: "竣工",
					data: [2],
					type: 'bar',
					label: {
						show: true,
						position: 'top',
					}
				}
			]
		};

		var myChart = echarts.init(dom);
		myChart.setOption(opt);
	}

	const hChart_proj_b2 = (dom) => {
		var opt = {
			title: {
				text: '项目总览  ',
				subtext: "总投资259亿元 , 计划年度投资65亿元 实际年度投资2.5亿",
				textStyle: {
					fontSize: _fsize,
					color: "#eee"
				},
				subtextStyle: {
					verticalAlign: 'middle',
					top: '10px',
					fontSize: 14,
					lineHeight: 36,
					color: "#F4A41F"
				},
				left: 'center'
			},
			tooltip: {
				trigger: 'item',
				formatter: '{a} <br/>{b} : {c} ({d}%)'
			},
			legend: {
				left: 'center',
				top: 'bottom',
				padding: '50',
				data: [
					'拆迁小区项目库',
					'房地产项目',
					'政府采购项目库',
					'零星项目库',
					'基础项目库',
					'民生项目库',
				]
			},
			series: [{
					name: '项目库',
					type: 'pie',

					radius: '60%',
					top: '20%',
					center: ['25%', '60%'],
					label: {
						show: false
					},
					emphasis: {
						label: {
							show: true
						}
					},
					data: [{
							value: 1,
							name: '拆迁小区项目库'
						},
						{
							value: 4,
							name: '房地产项目'
						},
						{
							value: 57,
							name: '政府采购项目库'
						},
						{
							value: 0,
							name: '零星项目库'
						},
						{
							value: 0,
							name: '基础项目库'
						},
						{
							value: 1,
							name: '民生项目库'
						},
					]
				},
				{
					name: '项目投资',
					type: 'pie',
					top: '20%',
					radius: '60%',
					center: ['75%', '60%'],
					roseType: 'area',
					itemStyle: {
						borderRadius: 5
					},
					label: {
						show: false
					},
					emphasis: {
						label: {
							show: true
						}
					},
					data: [{
							value: 39518,
							name: '拆迁小区项目库'
						},
						{
							value: 1329353,
							name: '房地产项目'
						},
						{
							value: 1059429,
							name: '政府采购项目库'
						},
						{
							value: 0,
							name: '零星项目库'
						},
						{
							value: 0,
							name: '基础项目库'
						},
						{
							value: 318,
							name: '民生项目库'
						},
					]
				}
			]
		};

		var myChart = echarts.init(dom);
		myChart.setOption(opt);
	}

	const hChart_proj_zx = (dom) => {
		var opt = {
			title: {
				text: "本周日报信息",
				textStyle: {
					fontSize: _fsize,
					color: "#eee"
				},
				textAlign: 'middle',
				left: '50%',
			},
			tooltip: {
				show: true,
				trigger: 'item',
			},
			grid: {
				top: '30px',
				right: '20px',
				bottom: '50',
				tooltip: {
					show: true,
					trigger: 'axis',
				},
				formatter: '{b0}: {c0}<br />{b1}: {c1}'
			},
			xAxis: {
				type: 'category',
				boundaryGap: false,
				data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
			},
			yAxis: {
				type: 'value',
				show: false,
			},
			series: [{
				name: "信息",
				symbol: 'none',
				data: [20, 9, 10, 34, 12, 30, 20, 0],
				type: 'line',
			}, ]
		};

		var myChart = echarts.init(dom);
		myChart.setOption(opt);
	}

	//graphicLayer.bindTooltip("我是layer上绑定的Tooltip");
	return {
		hChart_proj_zx,
		hChart_proj_b2,
		hChart_proj_bar,
		hChart_proj_qx,
		hChart_proj_gk,
		fnCrateCanv,
		fnCreatePattern,
		fnDrawNew,
		fnChart1,
		hBindCamEditMenu
	}
}

export default y_tools;